<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<title>banner管理</title>
</head>
<body>
	<jsp:include page="navigation.jsp"></jsp:include>
	<div class="container" style="margin-left: 190px; margin-bottom: 25px;">
		<div class="topbar-inner">
			<div class="myhead">
				<span class="crumb-name">banner管理</span>
			</div>
		</div>
		<div class="topbar-inner">
			<div class="search">
				<div class="input-group">
					<button type="button" id="add_btn" onclick="showalert_add()" class="btn btn-default" style="margin-left: 20px; margin-top: 1px;">新增</button>
				</div>
			</div>
		</div>
		<form id="pageForm" action="bannerinfo" method="post">
			<c:if test="${ page != null }">
				<input type="hidden" value="${ page.pageCount }" id="pageCount" name="pageCount" />
				<input type="hidden" value="${ page.pageIndex }" id="pageIndex" name="pageIndex" />
			</c:if>
		</form>

		<div style="margin: 20px 20px 20px 20px; text-align: center;">
			<table class="table table-bordered table-hover table-striped">
				<thead>
					<tr>
						<th>外链地址</th>
						<th>图片地址</th>
						<th>操作</th>
					</tr>
				</thead>
				<tbody>
					<c:forEach items="${ list }" var="l">
						<tr>
							<form id="trForm_${ l.id }" action="banneredit?id=${ l.id }" method="post" enctype="multipart/form-data">
								<td><input type="text" class="form-control" style="max-width: 450px;" value="${ l.url }" id="url_${ l.id }" name="url" /></td>
								<td><input type="file" class="btn" name="imgsfile" style="cursor: pointer;" id="uploadimage_${ l.id }" onchange="change('fileimage_${ l.id }','uploadimage_${ l.id }');" /> <c:if test="${ l.pic != null }">
										<img id="fileimage_${ l.id }" src="${ l.pic }" name="pic" width=45px />
									</c:if></td>
								<td><a href="javascript:" onclick="toEdit(${ l.id })">修改</a> &emsp;|&emsp; <a href="javascript:" onclick="delBanner(${ l.id })">删除</a></td>
							</form>
						</tr>
					</c:forEach>
				</tbody>
			</table>
		</div>
	</div>

</body>
<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<form action="banneredit" id="modal_form" method="post" enctype="multipart/form-data">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">类别管理</h4>
				</div>
				<div class="modal-body">
					<input type="hidden" id="modal_id" class="form-control" name="id" />
					<div style="width: 100%; height: 40px;">
						外链地址：<input type="text" id="modal_url" class="form-control" name="url" />
					</div>
					<div style="width: 100%; height: 100px;">
						图&emsp;&emsp;片： <input type="file" class="form-control" name="imgsfile" style="cursor: pointer;" id="uploadimage" onchange="change('fileimage','uploadimage');"> <img id="fileimage" src="images/defalut.png" name="pic" height="100px">
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary" onclick="toEdit('')">提交</button>
				</div>
			</form>
		</div>
	</div>
</div>
<!-- /.modal -->
<script type="text/javascript">
$(function() {
    $('.submenu_1_1').addClass('submenu_native');
});

function showalert_add() {
    $("#myModal").modal('show');
}

function toEdit(id) {
    if(id == ""){
        var add_url = $('#modal_url').val().replace(/\s+/g, '');
        if (add_url == '') {
            alert('外链地址不能为空！');
            return false;
        }
        if (add_url.substr(0, 7) != 'http://' || add_url.substr(0, 8) != 'https://') {
            
        } else {
            alert('外链地址格式不正确！');
            return false;
        }
        $('#modal_form').submit();
    }else{
        var add_url = $('#url_' + id).val().replace(/\s+/g, '');
        if (add_url == '') {
            alert('外链地址不能为空！');
            return false;
        }
        if (add_url.substr(0, 7) != 'http://' || add_url.substr(0, 8) != 'https://') {
            
        } else {
            alert('外链地址格式不正确！');
            return false;
        }
        $('#trForm_' + id).submit();
    }
}

function delBanner(id){
    if(confirm("是否删除")){
        $.ajax({
            type: "post",
            url: "./delBanner",
            data: {id :id},
            success: function(data){
                if (data != null) {
                    if(data.code == 0){
                        alert("删除成功");
                        window.location.reload();
                    }else{
                        alert("删除失败");
                        return;
                    }
                }
                
            }
        });
    }
}
</script>
</html>